<template>
	<h4>hook</h4>
	<!-- <p>生命周期顺序：beforeMount-index => beforeMount-hook => mounted-index => mounted-hook</p> -->
	
	<div class="home">
		<button @click="show = !show">show: {{ show }}</button>
		<hr />
		<button @click="hook_aaa_add">hook_aaa: {{ hook_aaa }}</button>
	</div>
</template>

<script setup lang="">
import { defineComponent, ref, onBeforeMount, onMounted, onBeforeUpdate, onUpdated, onBeforeUnmount, onUnmounted } from 'vue';
import hook_js from './hook.js';

let show = ref(true);
let { hook_aaa, hook_bbb, hook_aaa_add } = hook_js()

onBeforeMount(()=>{
	console.log('beforeMount-index');
})

onMounted(()=>{
	console.log('mounted-index');
})

console.log( hook_aaa, hook_bbb, hook_aaa_add );

</script>
